<ion-view view-title="贷款计算器">
    <ion-nav-buttons side="left">
        <back-button></back-button>
    </ion-nav-buttons>
    <ion-content ng-class="{'has-loading': isOffline}">
        <form name="counter_form"
              novalidate
              ng-submit="submit()">
            <ul class="Mt15">
                <li class="item item-input yitem">
                    <label class="input-label yfs2">
                        持有股票代码
                    </label>
                    <input type="text"
                           name="sharesCode"
                           placeholder="请输入持有股票代码"
                           ng-model="shares.code"
                           ng-change="getSharesName()"
                           required/>
                    <a ng-show="shares.code.length>0"
                       class="kClearEnter"
                       ng-click="shares.code=null;"></a>
                </li>
                <li class="item item-input yitem">
                    <label class="input-label yfs2">
                        股票名称
                    </label>
                    <input type="text"
                           name="sharesName"
                           ng-model="shares.name"
                           required
                           disabled/>
                </li>
                <li class="item item-input yitem">
                    <label class="input-label yfs2">
                        持有股票数
                    </label>
                    <input type="text"
                           name="code"
                           ng-pattern="/\d/"
                           placeholder="请输入持有股票数"
                           ng-model="shares.count"
                           required/>
                    <a ng-show="shares.count.length>0"
                       class="kClearEnter"
                       ng-click="shares.count=null;"></a>
                </li>
                <a class="item item-input item-icon-right yitem"
                   href="#/tab/account-borrowingPeriod/2'">
                    <label class="input-label yfs2">
                        融资期限
                    </label>
                    <input type="text"
                           name="sharesPeriod"
                           placeholder="请选择"
                           nt-model="shares.period"
                           required
                           disabled/>
                    <i class="icon ion-ios-arrow-right clr3"
                       style="font-size: 20px"></i>
                </a>
                <li class="item item-input yitem">
                    <label class="input-label yfs2">
                        质押率
                    </label>
                    <input type="text"
                           name="sharesRate"
                           ng-model="shares.rate"
                           required
                           disabled/>
                </li>
            </ul>
            <div class="button-bar btnbox Mt5">
                <button type="submit"
                        class="button btn button-full "
                        ng-disabled="counter_form.$invalid">
                    <span class="light fs1">
                        计算
                    </span>
                </button>
                <button type="reset"
                        class="button btn button-light button-full">
                    <span class="clr3">
                        重新输入
                    </span>
                </button>
            </div>
        </form>
        <ul class="light Mt5"
            ng-show="counter.money>0">
            <li class="item item-icon-right">
                可借金额（元）
                <i class="icon yMr5">
                    <label class="clr3 yfs2"
                           ng-bind="counter.money | number:2"></label>
                </i>
            </li>
            <li class="item item-icon-right">
                手续费（元）
                <a ng-click="show()"
                   class="ion-help-circled clr2"
                   style="font-size: 20px;"></a>
                <i class="icon yMr5">
                    <label class="clr3 yfs2"
                           ng-bind="counter.poundage | number:2"></label>
                </i>
            </li>
            <li class="item item-icon-right">
                实收金额（元）
                <i class="icon yMr5">
                    <label class="clr3 yfs2"
                           ng-bind="counter.price | number:2"></label>
                </i>
            </li>
            <li class="item item-icon-right">
                利息（元）
                <i class="icon yMr5">
                    <label class="clr3 yfs2"
                           ng-bind="counter.rate | number:2"></label>
                </i>
            </li>
            <li class="item item-icon-right">
                到期还款总额（元）
                <i class="icon yMr5">
                    <label class="clr3 yfs2"
                           ng-bind="counter.repayment | number:2"></label>
                </i>
            </li>
        </ul>
    </ion-content>
</ion-view>